<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
</head>

<body>
  <script>
    const info = { name: 'why' }
    const info2 = { age: 18 }

    // 1.对象类型的局限性,不可以使用复杂类型作为key
    const obj = {
      address: '北京市',
      [info]: "哈哈哈",
      [info2]: "呵呵呵"
    }
    console.log(obj)

    // 2.Map映射类型
    const map = new Map()
    map.set(info, "aaa")
    map.set(info2, "bbb")
    console.log(map)

    // 3.Map的常见属性和方法
    // 属性
    console.log(map.size)
    // 方法
    // 3.1 set(key, value)
    map.set("name", "why")
    console.log(map)
    // 3.2 get(key)
    console.log(map.get(info))
    // 3.3 has(key)
    console.log(map.has(info))
    // 3.4 delete(key)
    map.delete(info)
    console.log(map)
    // 3.5 clear()
    map.clear()
    console.log(map)
    // 3.6 forEach
    map.set(info, "aaa")
    map.set(info2, "bbb")
    map.forEach(item => console.log(item))
    // 4. for...of
    for (const item of map) {
      const [key, value] = item
      console.log(key, value)
    }
  </script>
</body>

</html>